<template>
	<view style="padding-top: 20upx;">
		
		<view style="height: 160upx;line-height: 160upx;position: relative;background-color: #FFFFFF;"  @click="chooseImage">
			<text style="padding-left: 20upx;font-size: 30upx;color: #666;">修改头像</text>
			<view style="position: absolute;top: 20upx;right: 20upx;border-radius: 60upx;">
				<image :src="avatar || '../../../../static/missing-face.png'" style="width: 120upx;height: 120upx;"></image>
			</view>
		</view>
		
		<view class="webkit list" style="margin-top: 12upx;">
			<view class="title">修改昵称</view>
			<input type="text" :value="nickname" @input="nicknameIpt" class="flex" />
		</view>
		<view style="padding: 0 24upx;">
			<button type="primary" style="background-color: #000;margin-top: 20upx;" @click="submit">确认修改</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				res:[],
				timestamp:'',
				user_id:'',
				nickname:'',
				avatar:'',
				imagess:[],
				imgurl:'',
			};
		},
		onLoad:function(){
			uni.showLoading()
			uni.getStorage({
				key: 'user_id',
				success: (res) => {
					this.user_id = res.data
					this.setAjax()
				},
				fail: () => {
					uni.navigateTo({
						// url: '../../../login/login'
					});
				}
			});
			uni.getStorage({
				key: 'timestamp',
				success: (res) => {
					this.timestamp = res.data
				},
				fail: () => {}
			});
		},
		methods:{
			setAjax(){
				uni.request({
					url:'https://cx.mingmeijt.com/Api/User/index',
					method: 'POST',
					data: {
						user_id: this.user_id,
						timestamp: this.timestamp,
						token:'1be42a581e1592a85bdfe6f8174e391f',
						},
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						uni.hideLoading()
						// if(res.data.member.nickname == '' ||res.data.member.nickname == undefined) {
						// 	this.nickname = ''
						// }
						// if(res.data.member.avatar == '' ||res.data.member.avatar == undefined) {
						// 	this.avatar = ''
						// }
						this.nickname = res.data.data.user_name
						this.avatar = res.data.data.real_head_img
					},
					fail: () => {},
					complete: () => {}
				});
			},
			chooseImage(){
				var _this = this
				uni.chooseImage({
				    count: 1, //默认9
				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				    sourceType: ['album'], //从相册选择
				    success: function (res) {
							let file = res.tempFilePaths
							var images = []
							var img = ''
							for(var i = 0; i<res.tempFilePaths.length; i++) {
								uni.uploadFile({
									url: 'https://cx.mingmeijt.com/Api/User/index',
									//仅为示例，非真实的接口地址
									filePath: file[i],
									name: 'file',
									formData: {
										'user': 'test'
									},
									success: (res) => {
										images.push(JSON.parse(res.data).url)
										_this.imagess = images
										_this.avatar = _this.imagess
										
										img = img + JSON.parse(res.data).url + ';'
										_this.imgurl = img
									}
								});
							}
				    }
				});
			},
			nicknameIpt(e){
				this.nickname = e.detail.value
			},
			submit(){
				uni.showLoading()
				uni.request({
					url: 'https://cx.mingmeijt.com/Api/User/updateUserInfo',
					method: 'POST',
					data: {
						user_id:this.user_id,
						nickname:this.nickname,
						avatar:this.avatar,
					},
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						uni.hideLoading()
						if(res.data.status ==1){
							setTimeout(() =>{
								uni.showToast({
									title: '修改成功'
								});
								uni.reLaunch({
									url: '../../member'
								})
							},500)
						}else{
							uni.showToast({
								title: '提交失败',
								icon:"none"
							});
						}
					},
					fail: () => {},
					complete: () => {}
				});
			}
		}
	}
</script>

<style>.list{padding:16upx 24upx;background:#fff;}.list .title{width:130upx;line-height:50upx;color:#666;}.list .flex{line-height:50upx;color:#666;padding-left:24upx;}.list .right{color:#999;}</style>